<template>
  <div>
    <div id="shoucang-header">
      <!-- 回退标识 -->
      <div class="huitui" @click="back()">
        <span class="iconfont zuojiantou"></span>
      </div>
      <a href="">收藏</a>
      <a href="">预约</a>
      <a href="">编辑</a>
    </div>

    <ul>
      <li>
        <router-link to="/Collection/Shipingshoucang">视频</router-link>
      </li>
      <li>
        <router-link to="/Collection/Manhuashoucang">漫画</router-link>
      </li>
    </ul>

    <router-view />
  </div>
</template>

<script>
export default {
  name: "Collection",
  methods: {
    back() {
      this.$router.back();
    }
  }
};
</script>

<style scoped>

a {
  color: black;
}
#shoucang-header {
  width: 100%;
  height: 0.66rem;
  background-image: linear-gradient(
    to right,
    #93bcea,
    #afa6ef,
    #e1e9fe,
    #c4e8fa
  );
  display: flex;
  justify-content: space-around;
  align-items: center;
  /* padding-left: 0.2rem; */
  box-sizing: border-box;
}
#shoucang-header a:nth-child(3) {
  margin-right: 0.13rem;
}
ul {
  width: 100%;
  display: flex;
  margin-bottom: 0.2rem;
}
ul li {
  width: 50%;
  height: 100%;
  text-align: center;
}
</style>